<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<link rel="stylesheet" type="text/css" href="css/top.css"/>
		<link rel="stylesheet" type="text/css" href="css/base.css"/>
		<link rel="stylesheet" type="text/css" href="css/通用.css"/>
		<link rel="stylesheet" type="text/css" href="css/floatLogo.css"/>

		<title>心动注册页面</title>
		<style type="text/css">
			*{
				margin: 0;
				padding: 0;
			}
			body{
				background-color:#f5f5f5 ;
				font-size: 13px;
			}
			a{
				color: #000000;
				text-decoration: none;
			}
			/* a:hover{
				color: darkorange;
			} */
			/* #img_box{
				margin-top: 40px;
				margin-left: 50px;
			}
			#img_box img{
				height: 70px;
			} */
			
			#table_box{
				margin-top: 30px;
				margin-left: 580px;
				width: 360px;
				height: 820px;
			}
			#table{
				border-radius: 20px;
				background-color:#ffffff ;
				padding-top: 40px;
				padding-left: 25px;
				width: 350px;
				height: 300px;
			}
			#table .textbox{
				width: 300px;
				height: 30px;
				border-radius: 8px;
				border-color: #e6e6e6;
			}
			#table td{
				height: 60px;
				width: 300px;
			}
			.enter{
				cursor:pointer;
				color: #FFFFFF;
				border-style: none;
				border-radius: 20px;
				background-color: #ff6600;
				width: 310px;
				height: 40px;
			}
		</style>
	</head>
	<body>
		<img src="img/imgmove.png" width="30px"  style="position: absolute;" id="imgmove">
		<div id="right_float" >
			<a href="index.html"><img src="img/logo.png" ></a>
		</div>
		<div id="top">
			<div id="top_center">
				<a href="index.html"><img src="./img/logo.png" class="logo" ></a>
				<div class="top_list_box">
					<ul class="top_list">
						<li>
							<a href="index.html">首页</a>
						</li>
						<li>
							<a href="论坛.html">论坛</a>
						</li>
						<li>
							<a href="游戏.html">游戏</a>
						</li>
						<li>
							<a href="加入心动.html">加入心动</a>
						</li>
						<li>
							<a href="家长指引.html">家长指引</a>
						</li>
						<li>
							<a href="#">其他</a>
							<ul>
								<li class="lis"><a href="留言.html">留言</a></li>
								<li class="lis"><a href="pacific.html">太平洋网络</a></li>
							</ul>
						</li>
					</ul>
				</div>
				<div class="search_box">
						<input type="text" name=""  value="" class="search" placeholder="搜索" /><a href=""><img src="img/搜索按钮.png" ></a>
						
				</div>
			</div>
		</div>
		<!-- <div id="img_box">
			<img src="img/logo3.jpg" >
		</div> -->
		
		<div id="table_box">
			
			<table border="0px" cellspacing="0" cellpadding="0" id="table">
			
				<tr>
					<td ><input type="text" name="" id="" value="" placeholder="用户名"/ class="textbox"></td>
					
				</tr>
				<tr>
					<td><input type="text" placeholder="密码" class="textbox"/></td>
					
				</tr>
				<tr>
					<td><input type="text" placeholder="确认密码" id="" value="" class="textbox" /></td>
					
				</tr>
				<tr>
					<td><input type="text" placeholder="真实姓名" id="" value="" class="textbox" /></td>
				</tr>
				<tr>
					<td><input type="text" placeholder="身份证" id="" value=""  class="textbox"/></td>
				</tr>
				<tr><td><input type="text" placeholder="常用邮箱" id="" value="" class="textbox" /></td></tr>
				<tr><td><input type="text" placeholder="手机号" id="" value="" class="textbox"/></td></tr>
				<tr><td><input type="text" placeholder="验证码" id="" value="" class="textbox"/></td></tr>
				<tr><td><button type="button" value="免费获取" class="enter" id="but" style="background-color: #fff0e5; color: #FF6600;border: 2px solid #FF8C00;">免费获取</button></td></tr>
				<tr><td><a href="#"><button type="button" value="立即注册" class="enter">立即注册</button></a></td></tr>
				<tr><td><input type="checkbox" name=""  />我已经阅读并同意 <a href="#">用户协议</a> 及 <a href="#">隐私协议</a></td></tr>
			</table>
		</div>
		<div class="base">
				<!-- 底部通用于所有网页 -->
				<div id="base_center">
					<table border="0px" cellspacing="20px" cellpadding="5px">
						
						<tr>
							<td>
								<a href="#">免责声明</a> |
								<a href="#">隐私政策</a> |
								<a href="#">用户协议</a> |
								<a href="#">游戏大厅</a> |
								<a href="#">论坛</a>
							</td>
							<td align="right"><img src="img/logo2.png" ></td>
						</tr>
						<tr>
							<td>学号：2403130240</td>
							<td></td>
						</tr>
						<tr>
							<td>姓名：陈奕喧</td>
							<td></td>
						</tr>
						<tr>
							<td>在线客服微信公众号：123456</td>
							<td align="right">河北互联网举报中心</td>
						</tr>
						<tr>
							<td>投诉举报邮箱：tousu@xd.com</td>
							<td align="right">网上有害信息举报专区</td>
						</tr>
					</table>
				</div>
			</div>
		
		<script type="text/javascript">
			//下拉列表
			var list=document.querySelector(".top_list");
			var lis=list.children;
			for(var i=0;i<lis.length;i++){
				if(lis[i].children.length=="2"){
					lis[i].addEventListener("mousemove",function(){
						this.children[1].style.display="block";
						
					});
					lis[i].addEventListener("mouseout",function(){
						this.children[1].style.display="none";
					});
				}
			}
			
			var but=document.getElementById("but");
			but.addEventListener("click",function(){
				var time=59;
				but.disabled=true;
				var timer=setInterval(function(){//设置定时器
					if(time==0){
						clearInterval(timer);
						but.disabled=false;
						but.innerHTML="免费发送";
					}else{
						but.innerHTML="还剩下"+time+"秒再次发送";
						time--;
					}
				},1000);
			})
			
			//鼠标事件
			var pic=document.getElementById("imgmove");//获取图片对象
			document.addEventListener('mousemove',function(e){//添加鼠标移动事件
				var x=e.pageX||e.clientX+(document.body.scrollLeft||document.documentElement.scrollLeft);//获取鼠标在文档中的x坐标
				var y=e.pageY||e.clientY+(document.body.scrollTop||document.documentElement.scrollTop);//获取鼠标在文档中的y坐标
				pic.style.left=x+2+"px";//第四象限
				pic.style.top=y+2+'px';
			})
		</script>
	</body>
</html>
